<%@ taglib uri="http://java.sun.com/jstl/fmt" prefix="fmt" %>
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c" %>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<!--                                           -->
<!-- Any title is fine                         -->
<!--                                           -->
<title>Double color balls</title>

<script type="text/javascript" src="resources/jquery-1.3.2.js"></script>
<script type="text/javascript" src="resources/jquery.form.js"></script>
<script type="text/javascript" src="resources/jquery.selectboxes.js"></script>
<script type="text/javascript">
    	       
        $(document).ready( function() {
        	initSelectBox();
            var options = { 
                    target:        '#result'
            }
            
            $('#myForm').submit(function() { 
                $(this).ajaxSubmit(options); 
                return false; 
            }); 

            //$('#myForm').reset(function() { 
            //    $(#result).innerHTML=""; 
            //    return true; 
            //}); 
                    
        });


	function initSelectBox() {

		var myOptions = {
			"0" :"0",
			"1" :" 1",
			"2" :" 2",
			"3" :" 3",
			"4" :" 4",
			"5" :" 5",
			"6" :" 6",
			"7" :" 7",
			"8" :" 8",
			"9" :" 9",
			"10" :" 10",
			"11" :" 11",
			"12" :" 12",
			"13" :" 13",
			"14" :" 14",
			"15" :" 15",
			"16" :" 16",
			"17" :" 17",
			"18" :" 18",
			"19" :" 19",
			"20" :" 20",
			"21" :" 21",
			"22" :" 22",
			"23" :" 23",
			"24" :" 24",
			"25" :" 25",
			"26" :" 26",
			"27" :" 27",
			"28" :" 28",
			"29" :" 29",
			"30" :" 30",
			"31" :" 31",
			"32" :" 32",
			"33" :" 33"
		};
		$("#number1").addOption(myOptions, false);
		$("#number2").addOption(myOptions, false);
		$("#number3").addOption(myOptions, false);
		$("#number4").addOption(myOptions, false);
	}
</script>

</head>

<body>

<form method="post" action="redblue" id="myForm">
<table>
	<tr>
		<td colspan="2" style="font-weight: bold;">Get an arrangement for
		your double color balls(ShuangSeQiu).</td>
		<td></td>
	</tr>
	<tr>
	    <td>Random Seed </td>
		<td><input type="text" value="0" name="seed" /></td>
		<td>Seed used to generate the random numbers, leave it 0 if you want us to pick one for you.</td>
	</tr>
	<tr>
	    <td>Numbers prefered</td>
		<td>
		<select id="number1" name="number1"></select> 
		<select id="number2" name="number2"></select>
		<select id="number3" name="number3"></select> 
		<select id="number4" name="number4"></select>
		</td>
		<td>Enter numbers which you want them to have a chance replacing the random selected number.</td>
	</tr>
	<tr>
	    <td>Preference Rate </td>
		<td><input type="text" value="10" name="rate" /></td>
		<td>How you want the above number being selected(in percentage)</td>
	</tr>
	<tr>
        <td></td>
        <td><input type="reset"  name="reset"/></td>
        <td><input type="submit" name="submit"/></td>
    </tr>
        <tr>
        <td>Generated result:</td>
        <td><div id="result"> </div></td>
        <td></td>
    </tr>
</table>
</form>
</body>
</html>
